<template>
  <van-swipe class="my-swipe" :autoplay="3000" indicator-color="orange" >
<van-swipe-item v-for="(item, index) in banner" :key="index">
    <img :src="item.imgUrl" alt="" >
    <!-- {{item}} -->
</van-swipe-item>
</van-swipe>
</template>

<script>
import Vue from 'vue';
import {mapState} from 'vuex'
import { Swipe, SwipeItem } from 'vant';
Vue.use(Swipe);
Vue.use(SwipeItem);
import {GET_BANNER_LIST} from '@/store/type/index'
export default {
    data() {
        return {
            // banner:[],
            
        }
    },
    mounted() {
     this.$store.dispatch({type:GET_BANNER_LIST})
     
    },
    computed: {
      ...mapState({
        banner:store=>store.home.banner
      })
    },
}
</script>

<style lang="scss">
  .my-swipe .van-swipe-item {
      width: 100%;
      height: 150px;
    color: #fff;
    font-size: 20px;
    text-align: center;
    img{
        width: 100%;
        height: 100%;
    }
  }
</style>